@import './modules/list-header';
@import './modules/list-footer';
@import './modules/reset';


.header{
	width: 100%;
	background-color: black;
}
.headerback{
	height: 50px;
}


.Zoom{
	height: 600px;
	display: flex;
	justify-content: center;
}

.images{
	a{
		img{
			width: 99%;
		}
		
	}
}




* {
    margin: 0;
    padding: 0;
  }

 li {
        list-style: none;
    }
.depic {
        width: 500px;
        margin-top: 50px;
		float: left;
    }
	
.demessage{
		width: 600px;
		height: 500px;
		margin-top: 50px;
		// background-color: darkgray;
		.pro-name{
			font-size: 20px;
			color: #333333;
			margin-bottom: 10px;
		}
		.pro-slogan{
			font-size: 16px;
			color: #2A2A2A;
			margin-top: 10px;
		}
		.pro-price{
			font-size: 24px;
			color: #00c65e;
			margin-top: 10px;
		}
		
		.pro-choose{
			margin-top: 30px;
			border-top: 1px solid #E7E7E7;
			padding-top: 18px;
			overflow: hidden;
			// .attr{
				.pro-choose-item{
					overflow: hidden;
					width: 100%;
					height: auto;
					display: inline-block;
					.pro-choose-name{
						width: 100px;
						height: 42px;
						float: left;
						margin-right: 20px;
						// text-align: justify;
						position: relative;
						line-height: 42px;
						font-size: 14px;
						text-align-last: justify;
					}
					.pro-choose-content{
						width: 400px;
						float: left;
						.pro-choose-pill{
							width: 150px;
							height: 42px;
							border-radius: 3px;
							text-align: center;
							float: left;
							line-height: 42px;
							margin: 0 20px 20px 0;
							border: 1px solid #DCE1E4;
							cursor: pointer;
						}
					}
				}
			// }
			
			
			.num{
				.sel-num{
					width: 150px;
					height: 42px;
					float: left;
					border: 1px solid #DCE1E4;
					position: relative;
					display: flex;
					button{
						width: 42px;
						height: 42px;
						border: none;
						background-color: inherit;
						outline: none;
						// position: absolute;
						cursor: pointer;
					}
					.num{
						width: 56px;
						height: 42px;
						line-height: 42px;
						// display: block;
						text-align: center;
						margin: 0 auto;
						border: none;
					}
				}
			}
		}
	}
		
		.button-col {
		    margin-top: 45px;
			.btn {
			    width: 170px;
			    height: 52px;
			    color: white;
			    padding: 15px 12px;
			    margin-right: 20px;
				outline: none;
				border: none;
				cursor: pointer;
			}
			.btn-black{
				background-color: black;
			}
			.btn-green{
				background-color: #00c65e;
			}
			#pay{
				display: inline-block;
				width: 170px;
				height: 52px;
				line-height: 52px;
				color: white;
				text-align: center;
				text-decoration: none;
				position: absolute;
			}
		}
		
		
.zoom-image {
         width: 400px;
     }

.imgs {
         width: 400px;
         overflow: hidden;
     }

.imgs li {
         float: left;
         margin: 10px 10px 0 0;
     }

.imgs a {
         display: block;
         border: 1px solid #dddddd;
     }

.imgs .zoomGalleryActive {
         border: 1px solid #f00;
     }

.imgs li .smallpic {
         width: 80px;
         height: 80px;
     }